<template>
  <!-- jhipster-pro-please-regenerate-this-file 如果您修改了此文件，并且不希望重新生成代码时被覆盖，请删除本行！！！-->
  <a-card :body-style="{ padding: '24px 32px' }" :bordered="false">
    <a-form layout="inline" @submit.prevent="save" class="ant-advanced-update-form">
      <a-row :gutter="24">
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.id')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.id.$model"
              id="common-table-relationship-id"
              name="id"
              read-only
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.name')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.name.$model"
              id="common-table-relationship-name"
              name="name"
              required
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.relationshipType')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select
              placeholder="请选择"
              id="common-table-relationship-relationshipType"
              name="relationshipType"
              required
              v-model="$v.commonTableRelationship.relationshipType.$model"
            >
              <a-select-option value="ONE_TO_MANY">{{ $t('jhipsterApp.RelationshipType.ONE_TO_MANY') }}</a-select-option>
              <a-select-option value="MANY_TO_ONE">{{ $t('jhipsterApp.RelationshipType.MANY_TO_ONE') }}</a-select-option>
              <a-select-option value="MANY_TO_MANY">{{ $t('jhipsterApp.RelationshipType.MANY_TO_MANY') }}</a-select-option>
              <a-select-option value="ONE_TO_ONE">{{ $t('jhipsterApp.RelationshipType.ONE_TO_ONE') }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.sourceType')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select
              placeholder="请选择"
              id="common-table-relationship-sourceType"
              name="sourceType"
              required
              v-model="$v.commonTableRelationship.sourceType.$model"
            >
              <a-select-option value="ENTITY">{{ $t('jhipsterApp.SourceType.ENTITY') }}</a-select-option>
              <a-select-option value="DATA_DICTIONARY">{{ $t('jhipsterApp.SourceType.DATA_DICTIONARY') }}</a-select-option>
              <a-select-option value="SERVICE_ENTITY">{{ $t('jhipsterApp.SourceType.SERVICE_ENTITY') }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.otherEntityField')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.otherEntityField.$model"
              id="common-table-relationship-otherEntityField"
              name="otherEntityField"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.otherEntityName')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.otherEntityName.$model"
              id="common-table-relationship-otherEntityName"
              name="otherEntityName"
              required
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.relationshipName')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.relationshipName.$model"
              id="common-table-relationship-relationshipName"
              name="relationshipName"
              required
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.otherEntityRelationshipName')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.otherEntityRelationshipName.$model"
              id="common-table-relationship-otherEntityRelationshipName"
              name="otherEntityRelationshipName"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.columnWidth')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.columnWidth.$model"
              id="common-table-relationship-columnWidth"
              name="columnWidth"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.order')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.order.$model"
              id="common-table-relationship-order"
              name="order"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.fixed')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select
              placeholder="请选择"
              id="common-table-relationship-fixed"
              name="fixed"
              v-model="$v.commonTableRelationship.fixed.$model"
            >
              <a-select-option value="LEFT">{{ $t('jhipsterApp.FixedType.LEFT') }}</a-select-option>
              <a-select-option value="RIGHT">{{ $t('jhipsterApp.FixedType.RIGHT') }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.editInList')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.editInList.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-editInList"
              name="editInList"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.enableFilter')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.enableFilter.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-enableFilter"
              name="enableFilter"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.hideInList')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.hideInList.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-hideInList"
              name="hideInList"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.hideInForm')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.hideInForm.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-hideInForm"
              name="hideInForm"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.searchForm')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.searchForm.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-searchForm"
              name="searchForm"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.system')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.system.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-system"
              name="system"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.fontColor')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.fontColor.$model"
              id="common-table-relationship-fontColor"
              name="fontColor"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.backgroundColor')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.backgroundColor.$model"
              id="common-table-relationship-backgroundColor"
              name="backgroundColor"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.help')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.help.$model"
              id="common-table-relationship-help"
              name="help"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.ownerSide')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.ownerSide.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-ownerSide"
              name="ownerSide"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.dataName')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.dataName.$model"
              id="common-table-relationship-dataName"
              name="dataName"
              required
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.webComponentType')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.webComponentType.$model"
              id="common-table-relationship-webComponentType"
              name="webComponentType"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.otherEntityIsTree')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.otherEntityIsTree.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-otherEntityIsTree"
              name="otherEntityIsTree"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.showInFilterTree')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.showInFilterTree.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-showInFilterTree"
              name="showInFilterTree"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.dataDictionaryCode')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.dataDictionaryCode.$model"
              id="common-table-relationship-dataDictionaryCode"
              name="dataDictionaryCode"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.clientReadOnly')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-switch
              v-model="$v.commonTableRelationship.clientReadOnly.$model"
              checkedChildren="是"
              unCheckedChildren="否"
              id="common-table-relationship-clientReadOnly"
              name="clientReadOnly"
            ></a-switch>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.endUsed')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select
              placeholder="请选择"
              id="common-table-relationship-endUsed"
              name="endUsed"
              v-model="$v.commonTableRelationship.endUsed.$model"
            >
              <a-select-option value="FILE_URL">{{ $t('jhipsterApp.EndUsedType.FILE_URL') }}</a-select-option>
              <a-select-option value="IMAGE_URL">{{ $t('jhipsterApp.EndUsedType.IMAGE_URL') }}</a-select-option>
              <a-select-option value="VIDEO_URL">{{ $t('jhipsterApp.EndUsedType.VIDEO_URL') }}</a-select-option>
              <a-select-option value="AUDIO_URL">{{ $t('jhipsterApp.EndUsedType.AUDIO_URL') }}</a-select-option>
              <a-select-option value="EDITOR">{{ $t('jhipsterApp.EndUsedType.EDITOR') }}</a-select-option>
              <a-select-option value="CODE_EDITOR">{{ $t('jhipsterApp.EndUsedType.CODE_EDITOR') }}</a-select-option>
              <a-select-option value="SELECT">{{ $t('jhipsterApp.EndUsedType.SELECT') }}</a-select-option>
              <a-select-option value="MODAL_SELECT">{{ $t('jhipsterApp.EndUsedType.MODAL_SELECT') }}</a-select-option>
              <a-select-option value="CHECKBOX">{{ $t('jhipsterApp.EndUsedType.CHECKBOX') }}</a-select-option>
              <a-select-option value="RADIO">{{ $t('jhipsterApp.EndUsedType.RADIO') }}</a-select-option>
              <a-select-option value="RATE">{{ $t('jhipsterApp.EndUsedType.RATE') }}</a-select-option>
              <a-select-option value="SLIDER">{{ $t('jhipsterApp.EndUsedType.SLIDER') }}</a-select-option>
              <a-select-option value="SWITCH">{{ $t('jhipsterApp.EndUsedType.SWITCH') }}</a-select-option>
              <a-select-option value="TEXT_AREA">{{ $t('jhipsterApp.EndUsedType.TEXT_AREA') }}</a-select-option>
              <a-select-option value="AVATAR">{{ $t('jhipsterApp.EndUsedType.AVATAR') }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.options')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-input
              placeholder="input placeholder"
              v-model="$v.commonTableRelationship.options.$model"
              id="common-table-relationship-options"
              name="options"
            />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.relationEntity')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select
              id="common-table-relationship-relationEntity"
              name="relationEntity"
              v-model="commonTableRelationship.relationEntityId"
            >
              <a-select-option v-bind:value="commonTableOption.id" v-for="commonTableOption in commonTables" :key="commonTableOption.id">{{
                commonTableOption.name
              }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.dataDictionaryNode')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select
              id="common-table-relationship-dataDictionaryNode"
              name="dataDictionaryNode"
              v-model="commonTableRelationship.dataDictionaryNodeId"
            >
              <a-select-option
                v-bind:value="dataDictionaryOption.id"
                v-for="dataDictionaryOption in dataDictionaries"
                :key="dataDictionaryOption.id"
                >{{ dataDictionaryOption.name }}</a-select-option
              >
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.metaModel')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select id="common-table-relationship-metaModel" name="metaModel" v-model="commonTableRelationship.metaModelId">
              <a-select-option v-bind:value="commonTableOption.id" v-for="commonTableOption in commonTables" :key="commonTableOption.id">{{
                commonTableOption.name
              }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item
            :label="$t('jhipsterApp.modelConfigCommonTableRelationship.commonTable')"
            :label-col="{ span: 8 }"
            :wrapper-col="{ span: 16 }"
          >
            <a-select id="common-table-relationship-commonTable" name="commonTable" v-model="commonTableRelationship.commonTableId">
              <a-select-option v-bind:value="commonTableOption.id" v-for="commonTableOption in commonTables" :key="commonTableOption.id">{{
                commonTableOption.name
              }}</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-row>
      <a-row type="flex" justify="center">
        <a-col span="3">
          <a-button @click="previousState()">{{ $t('entity.action.cancel') }}</a-button>
        </a-col>
        <a-col span="3">
          <a-button html-type="submit" type="primary" :disabled="$v.commonTableRelationship.$invalid || isSaving">{{
            $t('entity.action.save')
          }}</a-button>
        </a-col>
      </a-row>
    </a-form>
  </a-card>
</template>
<script lang="ts" src="./common-table-relationship-update-template.component.ts"></script>
<style>
.ant-advanced-update-form .ant-form-item {
  display: flex;
}
.ant-advanced-update-form .ant-form-item-control-wrapper {
  flex: 1;
}
</style>
